<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="author" content="Jxm">
    <link rel="shortcut icon" href="images/head.jpg" type="image/png">
    <link rel="icon" href="images/head.jpg" type="image/png">
    <title>贾萧嫚</title>
    <style>
            html,body{
                height: 100%;
                color: #fff;
            }
            body{
                background-image: url(images/timg.jpg);
                width: 100%;
                height: 700px;
            }
            nav{
                width: 100%;
                height: 50px;
                line-height: 50px;
                position: fixed;
                top: 0;
                text-align: center;
            }
            nav h1{
                display: inline-block;
                margin: 0;
                text-shadow: 0px 0px 18px #fff;
            }
            nav span{
                float: right;
                padding-right: 40px;
            }
            main{
                width: 100%;   
                margin-top: 80px;             
            }
            ul{
                list-style: none;
            }
            li{
                width: 80%;
                height: 50px;
                line-height: 50px;
                /*margin: 20px;*/
                margin-left: 200px;
                background-color: lightskyblue;
                border: 1px solid #444;
                font-size: 20px;
            }
            ul li>a{      
                display: inline-block;
                width: 100%;
                height: 100%;          
                text-decoration: none;
                color: paleturquoise;
                margin-left: 10px;
            }
            li:hover{
                background-color: lightblue;
            }
        </style>
</head>

<body>
    <nav>
        <h1>个人主页</h1><span>项目展示</span>
    </nav>
    <main>
        <ul>
            <li><a href="千图网/index.html">千图网</a></li>
            <li><a href="自动轮播图/自动轮播图.html">自动轮播图</a></li>
            <li><a href="星星评分/星星评分.html">星星评分</a></li>
            <li><a href="简易日历/date.html">简易日历</a></li>
            <li><a href="钢琴/index.html">钢琴</a></li>
            <li><a href="改变图片路径/starpicture.html">图片路径变大小</a></li>
            <li><a href="下拉菜单/下拉菜单.html">下拉菜单</a></li>
            <li><a href="选项卡/选项卡.html">选项卡</a></li>
            <li><a href="订单/订单.html">订单</a></li>
            <li><a href="模拟select/模拟select.html">模拟select</a></li>
            <li><a href="鼠标放上显示遮罩层/鼠标放上显示遮罩层.html">鼠标放上显示遮罩层</a></li>
            <li><a href="jQ轮播图/jQ轮播图.html">jQ轮播图</a></li>
            <li><a href="弹窗/弹窗.html">弹窗</a></li>
            <li><a href="jQ版上传图片/jQ版上传图片.html">jQ版上传图片</a></li>
            <li><a href="jQ版星星评分/jQ版星星评分.html">jQ版星星评分</a></li>
            <li><a href="图片切换/图片切换.html">图片切换</a></li>
            <li><a href="图片翻转切换/图片翻转切换.html">图片翻转切换</a></li>
            <li><a href="微博框/微博框.html">微博框</a></li>
            <li><a href="商品筛选/商品筛选.html">商品筛选</a></li>
            <li><a href="小米商城PC版/index.html">小米商城PC版</a></li>
        </ul>
    </main>
</body>

</html>
